
.content {
	height: 460px;
	margin-bottom: 14px;
	.container {
		height: 100%;
		position: relative;
		.swiper-container {
			width: 1226px;
			height: 460px;
			--swiper-theme-color: #aaa;
			.swiper-slide:hover {
				cursor: pointer;
			}
			.swiper-button-prev {
				left: 244px;
			}
			.swiper-pagination {
				left: 530px;
			}
			.swiper-button-prev:hover,
			.swiper-button-next:hover {
				--swiper-theme-color: #fff;
			}
		}
		.content-list {
			// display: none;
			position: absolute;
			left: 234px;
			top: 0;
			background: #fff;
			// width: 992px;
			height: 458px;
			z-index: 10;
			border: 1px solid #e0e0e0;
			border-left: none;
			box-shadow: 0 8px 16px rgba(0, 0, 0, 0.18);
			a {
				display: block;
			}
			ul {
				float: left;
				// display: flex;
				// flex-direction: column;
				// flex-wrap: wrap;
				width: 248px;
				height: 458px;
				// background: pink;
				li {
					float: left;
					// position: relative;
					box-sizing: border-box;
					// width: 248px;
					width: 265px;
					height: 76px;
					padding: 18px 20px;
					line-height: 40px;
					color: #333;
					transition: color 0.2s;
					&:hover {
						color: #ff6700;
						cursor: pointer;
					}
					img {
						width: 40px;
						float: left;
						margin-right: 12px;
					}
					span {
						float: left;
						// width: 172px;
						line-height: 40px;
						font-size: 14px;
					}
				}
			}
		}
		.content-l {
			position: absolute;
			left: 0;
			top: 0;
			width: 234px;
			height: 100%;
			background: rgba(105, 101, 101, 0.6);
			padding: 20px 0;
			box-sizing: border-box;
			z-index: 10;
			a {
				display: block;
			}
			li {
				font-size: 14px;
				color: #fff;
				height: 42px;
				width: 204px;
				padding-left: 30px;
				line-height: 42px;
				span {
					float: right;
					margin: 0 24px;
				}
			}
			li:hover {
				cursor: pointer;
				background: #ff6700;
			}
		}
		.content-r {
			// width: 992px;
			height: 100%;
		}
	}
}

.home {
	height: 170px;
	margin-bottom: 25px;
	.container {
		height: 100%;
		display: flex;
		justify-content: space-between;
		.home-l {
			background: #5f5750;
			width: 234px;
			height: 100%;
			padding: 3px;
			box-sizing: border-box;
			div {
				width: 76px;
				height: 82px;
				padding: 49px 3px 0 3px;
				box-sizing: border-box;
				float: left;
				font-size: 12px;
				background: url(../images/seckill_07.jpg) no-repeat 27px 19px;
				color: #c3c0bd;
				text-align: center;
			}
		}
		.home-r {
			width: 316px;
			height: 170px;
		}
		.home-r:hover {
			cursor: pointer;
		}
	}
}

.main {
	height: 1300px;
	background: #f5f5f5;
	.container {
		.buy {
			height: 400px;
			margin-bottom: 22px;
			.buy-t {
				height: 60px;
				position: relative;
				h3 {
					height: 60px;
					font-size: 22px;
					line-height: 60px;
					color: #333;
				}
				.swiper-button-prev2,
				.swiper-button-next2 {
					// position: absolute;
					// right: 0;
					// top: 24px;
					// .swiper-container2 {
					--swiper-theme-color: #aaa; /* 设置Swiper风格 */
					// --swiper-navigation-color: #ff6600;/* 单独设置按钮颜色 */
					--swiper-navigation-size: 10px; /* 设置按钮大小 */
					//   }
					// span {
					// 	float: left;
					width: 36px;
					height: 24px;
					// 	text-align: center;
					// 	color: #333;
					border: 1px solid #e0e0e0;
					outline: none;
					// }
					// &:hover {
					// 	color: #ff6700;
					// 	cursor: pointer;
					// }
				}
				.swiper-button-prev2 {
					left: 1142px;
				}
				.swiper-button-prev2:hover,
				.swiper-button-next2:hover {
					--swiper-theme-color: #ff6700;
				}
			}
			.buy-b {
				height: 340px;
				display: flex;
				justify-content: space-between;
				.shandian {
					border-top: 1px solid #e53935;
					width: 234px;
					background: #f1eded url(../images/shandian_03.jpg) no-repeat
						100px 110px;
					box-sizing: border-box;
					padding-top: 60px;
					text-align: center;
					margin-right: 14px;
					h4 {
						font-size: 21px;
						color: #ef3a3b;
					}
					h4:hover {
						cursor: pointer;
					}
					p {
						color: rgba(0, 0, 0, 0.54);
						font-size: 15px;
						margin-top: 120px;
					}
					.time {
						margin: 28px 33px 0;
						width: 168px;
						display: flex;
						justify-content: space-between;
						div {
							width: 46px;
							height: 46px;
							background: #605751;
							color: #fff;
							font-size: 24px;
							line-height: 46px;
						}
						i {
							width: 15px;
							height: 46px;
							display: block;
							line-height: 46px;
							color: #605751;
							font-size: 28px;
						}
					}
				}

				.buy-b-r {
					display: flex;
					justify-content: space-between;
					width: 978px;
				}
				.buy-right {
					width: 234px;
					height: 339px;
					background: #fafafa;
					text-align: center;
					h5 {
						font-size: 14px;
						color: #000;
						height: 14px;
					}
					p {
						font-size: 12px;
						height: 12px;
						color: #adadad;
						margin: 10px 0 20px;
					}
					.i {
						font-size: 12px;
						height: 12px;
						i {
							color: #ff6700;
						}
						s {
							color: #adadad;
						}
					}
				}
				.buy-right:hover {
					cursor: pointer;
				}
			}
		}

		.phone {
			height: 814px;
			margin-bottom: 36px;
			.phone-t {
				height: 120px;
				margin-bottom: 22px;
			}
			.phone-t:hover {
				cursor: pointer;
			}
			h2 {
				height: 58px;
				line-height: 58px;
				font-size: 22px;
				color: #333;
				position: relative;
				.more {
					display: block;
					width: 92px;
					height: 58px;
					background: #f5f5f5;
					font-size: 16px;
					position: absolute;
					right: 0;
					top: 0;
					p {
						float: left;
						color: #424242;
						line-height: 58px;
						transition: all 0.5s;
					}
					.more-icon {
						float: right;
						width: 20px;
						height: 20px;
						background: #b0b0b0;
						color: #fff;
						margin: 19px 0;
						line-height: 20px;
						text-align: center;
						border-radius: 50%;
						transition: all 0.5s;
					}
				}
				.more:hover {
					cursor: pointer;
				}
				.more:hover p {
					color: #ff6700;
					transition: all 0.5s;
				}
				.more:hover .more-icon {
					background: #ff6700;
					transition: all 0.5s;
				}
			}
			.phone-b {
				height: 614px;
				.phone-l {
					width: 234px;
					height: 614px;
					position: relative;
					top: 0;
					left: 0;
					transition: all 0.2s linear;
				}
				.phone-l:hover {
					top: -2px;
					box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
					transform: translate3d(0, -2px, 0);
					cursor: pointer;
				}

				.phone-r {
					li {
						float: left;
						margin: 0 0 14px 14px;
						width: 234px;
						height: 300px;
						background: #fff;
						box-sizing: border-box;
						padding: 20px 0;
						position: relative;
						transition: all 0.2s linear;
						text-align: center;
						img {
							margin: 0 37px 18px 37px;
						}
						h5 {
							font-size: 14px;
							color: #000;
							height: 14px;
						}
						p {
							font-size: 12px;
							height: 12px;
							color: #adadad;
							margin: 10px 0 18px;
						}
						.i {
							font-size: 12px;
							height: 12px;
							i {
								color: #ff6700;
							}
							s {
								color: #adadad;
							}
						}
					}
					li:hover {
						top: -2px;
						box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
						transform: translate3d(0, -2px, 0);
						cursor: pointer;
					}
				}
			}
		}
	}
}

.tool-6 {
	position: fixed;
	bottom: 60px;
	right: 0;
	z-index: 99;
	width: 84px;
	background: #fff;
	width: 84px;
	height: 92px;
	border: 1px solid #f5f5f5;
	border-bottom: 0;
	padding-top: 60px;
	box-sizing: border-box;
	text-align: center;
	color: #757575;
	font-size: 14px;
	line-height: 14px;
	transition: color 0.3s;
	background: #fff url(../images/totop.png) no-repeat center 20px;
	background-size: 30px;
	display: none;
}
.tool-6:hover {
	cursor: pointer;
	background: #fff url(../images/totop_hover.png) no-repeat center 20px;
	background-size: 30px;
	color: #ff6700;
	transition: all 0.3s;
}
.tool {
	position: fixed;
	bottom: 170px;
	right: 0;
	z-index: 99;
	width: 84px;
	background: #fff;
	li {
		width: 84px;
		height: 92px;
		border: 1px solid #f5f5f5;
		border-bottom: 0;
		padding-top: 60px;
		box-sizing: border-box;
		text-align: center;
		color: #757575;
		font-size: 14px;
		line-height: 14px;
		transition: color 0.3s;
	}
	.tool-1 {
		background: #fff url(../images/side-01.png) no-repeat center 20px;
		background-size: 30px;
		.app {
			position: absolute;
			width: 124px;
			height: 192px;
			box-sizing: border-box;
			padding: 17px;
			top: 0;
			left: -134px;
			background: #fff;
			box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
			font-size: 14px;
			text-align: center;
			display: none;
			line-height: 22px;
			color: #333;
			.img {
				width: 90px;
				height: 90px;
				margin-bottom: 20px;
			}
		}
	}
	// .tool-1:hover .app {
	// 	// display: block;
	// 	// color: #333;
	// }
	.tool-2 {
		background: #fff url(../images/side-11.png) no-repeat center 20px;
		background-size: 30px;
	}
	.tool-3 {
		background: #fff url(../images/side-21.png) no-repeat center 20px;
		background-size: 30px;
	}
	.tool-4 {
		background: #fff url(../images/side-31.png) no-repeat center 20px;
		background-size: 30px;
	}
	.tool-5 {
		background: #fff url(../images/side-41.png) no-repeat center 20px;
		background-size: 30px;
	}
	.tool-1:hover {
		cursor: pointer;
		background: #fff url(../images/side-02.png) no-repeat center 20px;
		background-size: 30px;
		color: #ff6700;
		transition: all 0.3s;
	}
	.tool-2:hover {
		cursor: pointer;
		background: #fff url(../images/side-12.png) no-repeat center 20px;
		background-size: 30px;
		color: #ff6700;
		transition: all 0.3s;
	}
	.tool-3:hover {
		cursor: pointer;
		background: #fff url(../images/side-22.png) no-repeat center 20px;
		background-size: 30px;
		color: #ff6700;
		transition: all 0.3s;
	}
	.tool-4:hover {
		cursor: pointer;
		background: #fff url(../images/side-32.png) no-repeat center 20px;
		background-size: 30px;
		color: #ff6700;
		transition: all 0.3s;
	}
	.tool-5:hover {
		cursor: pointer;
		background: #fff url(../images/side-42.png) no-repeat center 20px;
		background-size: 30px;
		color: #ff6700;
		transition: all 0.3s;
	}

	a {
		display: block;
	}
}
html,
body {
	scroll-behavior: smooth;
}
